import React, { Component } from 'react'
import './index.css'

export default class List extends Component {
  render() {
    const {users,isFirst,isLoading,err} = this.props
    return (
        <div className="row">
            {
                isFirst? <h2>首次进入</h2>:
                isLoading? <h2>加载中...</h2>:
                err? <h2 style={{color:'red'}}>{err}</h2>:
                users.map((usersObj)=>{
                    return (
                        <div className="card" key={usersObj.id}>
                            <a rel="noreferrer" href={usersObj.html_url} target="_blank">
                                <img alt='head_portrait' src={usersObj.avatar_url} style={{width: '100px'}}/>
                            </a>
                            <p className="card-text">{usersObj.login}</p>
                        </div>
                    )
                })
            }
      </div>
    )
  }
}
